
<!DOCTYPE html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>网桥Shell交互</title>
    <!-- <link href="http://cdn.bootcss.com/bootstrap/3.2.0/css/bootstrap.min.css" rel="stylesheet"> -->
    <link href="../css/bootstrap/bootstrap.min.css" rel="stylesheet">
    <link href="../css/global.css" rel="stylesheet">
    <link href="../css/bootstrap-datetimepicker.min.css" rel="stylesheet" media="screen">
    <link href="../css/_x_ctr_location.css" rel="stylesheet" type="text/css" />
    <link href="../css/cmxform.css" rel="stylesheet" type="text/css" />

</head>

<body>
	<!--1.0 narbar -->
    <div   class="fixedNavbar">
       <#include "../navbar.html">
	</div>

    <div class="container-fluid">
    	<!--2.0 left sidebar -->
        <div class="row">
            <#include "../sidebar.html">

            <!--2.1 main content -->
            <div class="col-md-10">

                    <!--2.1.0 tab title -->
		            <ul id="myTab" class="nav nav-tabs" role="tablist">
		                <li class="active"><a href="#fee-manage" role="tab" data-toggle="tab"><i class="glyphicon glyphicon-globe"></i>&nbsp;网桥命令交互</a>
		                </li>
		            </ul>

                    <!--2.1.1 form-->
                    <form id="cmdForm" class="form-horizontal" role="form" action="submitQRegister" method="post" enctype="multipart/form-data">
                        <div class="panel panel-default">
                            <div class="panel-heading" style="font-weight:bold;">网桥Shell交互
                                <span style = "font-size:20px;color:red;font-weight:bold;"></span> 
                            </div>
                            <div class="panel-body">
                                <div class="form-group">
                                    <label for="ip" class="col-sm-2 control-label">ip</label>
                                    <div class="col-sm-3">
                                        <input type="text" class="form-control col-sm-3" name="ip" id="ip" placeholder="ip地址">
                                    </div>
                                </div>
                                <div class="form-group">
                                    <label for="linuxCmd" class="col-sm-2 control-label">输入命令</label>
                                    <div class="col-sm-3">
                                        <input type="text" class="form-control col-sm-3" name="linuxCmd" id="linuxCmd" placeholder="输入交互命令">
                                    </div>
                                </div>
                            </div>
                            <div class="panel-footer">
                                <div class="form-group">
                                    <div class="col-sm-offset-2 col-sm-3">
                                        <button type="submit" id="btn-register" class="btn btn-primary">执行命令</button>
                                        <label id="cmd-hint" class="error" for="submit"></label>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </form>
					
					<form role="form" >
						<div class="form-group">
							<label for="name">输出结果</label>
							<textarea id="cmdResult" style="height:200px;" class="form-control" rows="3" disabled></textarea>
						</div>
					</form>
            </div>
        </div>
    </div>
    <script src="../js/bootstrap/jquery-1.11.1.min.js"></script>
    <script src="../js/bootstrap/bootstrap.min.js"></script>
    <script src="../js/_x_ctr_location-1.0.min.js"></script>
    <script src="../js/jquery.iframe-transport.js"></script>
    <script src="../js/jquery.validate.js"></script>
    <script src="../js/WdatePicker.js"></script>
    <script src="../js/jquery.tablesorter.min.js"></script>
    <script src="../js/common.js"></script>
	<script src="../js/util.js"></script>
	<script src="../js/sha1.js"></script>

    <script>
    	$(function(){
    		
    		$.validator.addMethod("ip", function(value, element) {
		    	return this.optional(element) || (/^(\d+)\.(\d+)\.(\d+)\.(\d+)$/.test(value) && (RegExp.$1 <256 && RegExp.$2<256 && RegExp.$3<256 && RegExp.$4<256)); 
		    });
    		
			$("#cmdForm").validate({
				rules: {
					linuxCmd: {
						required: true,
						maxlength: 1000
					},
					ip: {
						required: true,
						ip: ""
					}
				},
				messages: {
					linuxCmd: {
				       required: "输入命令",
				       maxlength: 1000
				    },
				    ip: {
						required: "请输入ip地址",
						ip: "ip地址格式错误"
					}
				},
				submitHandler : function(form) {
					debugger;
					$("#cmd-hint").text("正在运行,请稍后...").show();
					var linuxCmd = $("#linuxCmd").val();
					var ip = $("#ip").val();
					
					var url = "/eoip/web/boxCmdInteract";
					var params = {  
									boxId:'132321',//这里boxId是否需要,需要确认后期需求
									ip:ip,
									command:linuxCmd
									};
					
				 	common.post(url, params, function (data) {
                        $("#cmd-hint").text('').show();
                        var data = jQuery.parseJSON(data);
                        if (data.code == "1") {
                            $("#cmdResult").html("执行结果:\n"+data.result+"\n" + "执行时间:"+data.timecost + "ms");
                            //alert('命令执行成功!');
                            //location.href = '/eoip/web/box_quick_registration';
                        } else {
                            $("#cmdResult").html("执行结果:\n"+data.info+"\n");
                        }//end if
                    });//end common post
				}
			});
    	});
    </script>
</body>
</html>
